<template>
  <el-dialog :visible.sync="open" @close="close" :title="title" width="800px" append-to-body destory-on-close>
    <el-form ref="elForm" :model="formData" size="small" label-width="100px" label-position="left">
      <el-row :gutter="15">
        <el-col :span="24">
          <el-form-item label="预案模板" prop="event_name">
            {{ formData.planName }}
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="15">
        <el-col :span="24">
          <el-form-item label="原响应级别" prop="event_name">
            {{ formData.responseLevelLabel }}
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="15">
        <el-col :span="10">
          <el-form-item label="新响应级别" prop="event_name">
            <el-select v-model="responseLevel" placeholder="请选择响应级别" :style="{ width: '100%' }">
              <el-option v-for="item in responseLevelOption" :key="item.value" :label="item.label" :value="item.value" />
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <div slot="footer">
      <el-button @click="close">取消</el-button>
      <el-button type="primary" @click="handleConfirm">确定调整</el-button>
    </div>
  </el-dialog>
</template>
<script>
import dialogMixin from "@/mixins/dialogMixin";

export default {
  name: "EventResponseLevelSetDialog",
  mixins: [dialogMixin],
  props: {
    taskType: {
      type: String,
      default: "drill",
    },
  },
  data() {
    return {
      formData: {
        infoTitle: "",
        planName: 0,
        responseLevel: "",
        status: 1,
        handleId: 0,
        planId: 0,
      },
      title: "处置事件",
      responseLevel: 1,
      responseLevelOption: [
        {
          label: "Ⅰ级响应",
          value: 1,
        },
        {
          label: "Ⅱ级响应",
          value: 2,
        },
        {
          label: "Ⅲ级响应",
          value: 3,
        },
        {
          label: "Ⅳ级响应",
          value: 4,
        },
      ],
    };
  },
  computed: {},
  watch: {},
  created() {},
  mounted() {},
  methods: {
    showDialog(data) {
      let level = this.responseLevelOption.find(val => val.value == Number(data.responseLevel));
      this.formData = {
        planName: data.planDetail.planName,
        responseLevelLabel: level.label,
        responseLevel: Number(data.responseLevel),
      };
      console.log(data);
      this.responseLevel = Number(data.responseLevel);
      this.open = true;
    },
    handleConfirm() {
      if (this.responseLevel == this.formData.responseLevel) {
        this.$modal.msgError("新响应级别不能和原响应级别相同");
        return false;
      }
      this.formData.responseLevel = this.responseLevel;
      this.$emit("handleOk", this.formData);
      this.open = false;
    },
    handlePickStaff() {
      this.$refs.staffChooseDialog.showDialog("选择执行人");
    },
    onStaffSelected(data) {},
    handlePickPlan() {
      this.$refs.planPicker.showDialog();
    },
    onPlanSelected() {},
  },
};
</script>
<style></style>
